<template>
	<!-- 商城底部菜单栏 -->
	<u-tabbar :value="current" @change="changeSwitch" :fixed="true" :placeholder="true" :safeAreaInsetBottom="true"
		zIndex='9999'>
		<u-tabbar-item :text="item.text" :icon="!item.external ? item.icon : '' " v-for="item in list">
			<image v-if="item.external" class="u-page__item__slot-icon" slot="active-icon" :src="item.selected"></image>
			<image v-if="item.external" class="u-page__item__slot-icon" slot="inactive-icon" :src="item.def"></image>
		</u-tabbar-item>
	</u-tabbar>
</template>
<script>
	export default {
		name: "shop-bar",
		props: {
			current: {
				// 当前选中的tab index
				type: Number,
				default: 0,
			},
		},
		data() {
			return {
				list: [{
						external: true,
						def: '/../static/tabbar/home02.png',
						selected: '/../static/tabbar/home02_selected.png',
						text: '首页',
						url: '/pages/shop/index/index'
					},
					{
						external: true,
						def: '/../static/tabbar/goods.png',
						selected: '/../static/tabbar/goods_selected.png',
						text: '列表',
						url: '/pages/shop/goods/index'
					},
					{
						external: true,
						def: '/../static/tabbar/cart.png',
						selected: '/../static/tabbar/cart_selected.png',
						text: '购物车',
						url: '/pages/shop/cart/index'
					},
					{
						external: true,
						def: '/../static/tabbar/my02.png',
						selected: '/../static/tabbar/my02_selected.png',
						text: '我的',
						url: '/pages/shop/my/index'
					},
				]
			};
		},
		methods: {
			changeSwitch(e) {
				console.log(getCurrentPages().length);
				if (getCurrentPages().length >= 5) {
					wx.reLaunch({
						url: this.list[e].url
					})
				} else {
					uni.navigateTo({
						url: this.list[e].url
					})
				}
			}
		}
	}
</script>

<style scoped lang="scss">
	.u-page__item__slot-icon {
		width: 24px;
		height: 24px;
	}
</style>